<template>
    <div class="warpper-box">
      <div class="inner_box">
       <form-create 
       v-model="params.fApi" 
       :rule="params.rule" 
       :option="params.option" 
       @btn-search-click="loadList(true)" 
       @btn-reset-click="reset"/>
      <contract-list
       :key="keys"
       :tableData="tables.tableData" 
       :tableLabel="tables.tableLabel" 
       :models="tables" 
       @on-search-click="loadList"
       @on-find-click="function(row){return contracts(row,'details')}"
       @on-addContract-click="function(row){return contracts(row,'createContract')}"
       @on-edit-click="function(row){return contracts(row,'edit')}"
       />
       <el-dialog :title="contract.edit.title" :visible.sync="contract.edit.visible" :width="contract.edit.width" :close-on-click-modal="false">
        <form-create 
        v-model="contract.edit.fApi" 
        :rule="contract.edit.rule" 
        :option="contract.edit.option" />
        <div slot="footer" class="dialog-footer">
          <el-button size="small" @click="contract.edit.visible = false">取 消</el-button>
          <el-button size="small" type="primary" @click="onFormSubmit">保存</el-button>
        </div>
      </el-dialog>

      <el-dialog :title="contract.details.title" :visible.sync="contract.details.visible" :width="contract.details.width" :showClose="false" :close-on-click-modal="false">
        <contractDetails v-if="contract.details.hackReset" :row="contract.row"  @on-cancel-click="onCancel"/>
      </el-dialog>

      <el-dialog :title="contract.createContract.title" :visible.sync="contract.createContract.visible" :width="contract.createContract.width" :showClose="false" :close-on-click-modal="false">
        <contractCreate v-if="contract.createContract.hackReset" :row="contract.row"  @on-cancel-click="onCancel"/>
      </el-dialog>

      </div>
    </div>
  </template>
  
  <script>
  import { PARAMS_CONTRACT,FORM_CONTRACT,LABEL_CONTRACT,OPTION_BLOCK,OPTION_INLINE} from "./contractModel/contract_form"
  import contractList from "./contractModel/contract_model_list"
  import contractDetails from "@/views/contract/contract_details"
  import contractCreate from "@/views/contract/contract_create"
  import {getContractList,editContractPrice} from "@/api/contract_api"
  export default {
    components:{
        contractList,
        contractDetails,
        contractCreate
    },
    data() {
      return {
        keys:0,
        params:{
          fApi:{},
          rule:PARAMS_CONTRACT,
          option:OPTION_INLINE
        },
        tables:{
          total:0,
          fixed:'right',
          width:'270',
          tableData:[],
          tableLabel: LABEL_CONTRACT
        },
        page:{
          pageNum:1,
          pageSize:10,
        },
        contract:{
          row:{},
          
          details:{
            title:'合同详情',
            width:"1200px",
            visible:false,
            hackReset:true
          },
          createContract:{
            title:'生成合同',
            width:"1200px",
            visible:false,
            hackReset:true
          },
          edit:{
            title:'修改付款',
            width:"550px",
            visible:false,
            fApi:{},
            rule:[],
            option:OPTION_BLOCK
          },
        }
      };
    },
    mounted() {
      this.loadList(true);
      this.$nextTick(()=>{
        this.params.fApi.setValue({"name":"","supplierId":"","time":[]});
      })
    },
    methods: {
      async loadList(formData) {
        let params = {};
        let query = this.params.fApi.bind();
        if(query.time && query.time.length != 0){
          params.startTime = query.time[0];
          params.endTime = query.time[1];
        }
        params.supplierId = query.supplierId;
        params.name = query.name;
        if(formData !== undefined && formData.type === 'page'){
          this.page.pageNum = formData.pageNum;
          this.page.pageSize = formData.pageSize;
        }
        if(formData===true){
          this.page.pageNum = 1;
          this.keys++;
        }
        params.projectType = "1";//标的类型 1.物资招标 2.劳务招标
        params.pageNum = this.page.pageNum;
        params.pageSize = this.page.pageSize;
        const req = await getContractList(params);
        let btn = this.$store.getters.permission_btns;
        this.tables.tableData = req.data.list;
        this.tables.tableData.forEach(v=>{

            v.purchasePrice = (v.purchasePrice/100);
            v.contractPrice = (v.contractPrice/100);
            v.payMoney = (v.payMoney/100);
            v.winPrice = (v.winPrice/100);

            if(v.status === '0'){//未签合同才能生成合同
              v.add = btn.includes('addContract');//是否有权限
            }
            v.find= btn.includes('contractDetails');//是否有权限
            v.editPrice = btn.includes('editContract');//是否有权限
        })
        this.tables.total = req.data.total;
      },
      contracts(row,flag){
        if(flag === 'edit'){
          this.contract[flag].rule = FORM_CONTRACT;
          this.$nextTick(()=>{
            this.contract[flag].fApi.setValue({"payMoney":"","payName":""})
          })
        }
        this.contract.row = row;
        this.contract[flag].hackReset = false;
        this.$nextTick(()=>{
          this.contract[flag].hackReset = true;
        })
        this.contract[flag].visible = true;
      },
      async onFormSubmit(formData) {
        this.contract.edit.fApi.submit(async (formData, $f) => {
          try {
            formData.id = this.contract.row.id;
            const {code} = await editContractPrice(formData);
            if(code===200){
              this.$message.success('操作成功');
              this.contract.edit.visible = false;
              this.loadList();
            }
          } catch (error) {
            //this.$message.info(JSON.stringify(error));
          }
        })
      },
      onCancel(flag){
        this.contract[flag].visible = false;
        this.loadList(true);
      },
      reset(){
        this.params.fApi.resetFields();
        this.loadList(true);
      }
    }
  };
  </script>